﻿<UserControl x:Class="FacebookClient.SortControl"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:FacebookClient="clr-namespace:FacebookClient" 
    xmlns:ClientManager="clr-namespace:ClientManager" 
    xmlns:ClientManagerControls="clr-namespace:ClientManager.Controls"
    xmlns:Facebook="clr-namespace:Contigo;assembly=Contigo"
    Focusable="False"
    x:Name="TopControl">
  
  <UserControl.Resources>
    <BooleanToVisibilityConverter x:Key="BooleanToVisibilityConverter"/>

    <Style x:Key="SortTabControlStyle" TargetType="{x:Type TabControl}">
      <Setter Property="Template">
        <Setter.Value>
          <ControlTemplate TargetType="TabControl">
            <StackPanel IsItemsHost="True" />
          </ControlTemplate>
        </Setter.Value>
      </Setter>
      <Setter Property="ItemContainerStyle">
        <Setter.Value>
          <Style TargetType="TabItem">
            <Setter Property="Template">
              <Setter.Value>
                <ControlTemplate TargetType="{x:Type TabItem}">
                  <Grid Height="31">
                    <Border x:Name="selected" Opacity="0" Background="{DynamicResource FilterButtonSelectedBrush}" BorderBrush="{DynamicResource FilterBorderBrush}" BorderThickness="0,1,0,1" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" SnapsToDevicePixels="True" />
                    <Border x:Name="hover"    Opacity="0" Background="{DynamicResource FilterButtonSelectedBrush}" BorderBrush="{DynamicResource FilterBorderBrush}" BorderThickness="0,1,0,1" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" SnapsToDevicePixels="True" />

                    <Rectangle Fill="{DynamicResource FilterButtonDivider1}" HorizontalAlignment="Stretch" VerticalAlignment="Top" Height=".5" SnapsToDevicePixels="True" />
                    <Rectangle Fill="{DynamicResource FilterButtonDivider2}" HorizontalAlignment="Stretch" VerticalAlignment="Bottom" Height=".5" SnapsToDevicePixels="True" />

                    <TextBlock x:Name="text" Foreground="{DynamicResource FilterTabItemForegroundUnSelected}" FontSize="{DynamicResource MiddleFontSize}" FontWeight="Light" FontFamily="{DynamicResource SansSerifFont}" Text="{Binding Name}" Margin="5,0" VerticalAlignment="Center" TextTrimming="CharacterEllipsis" />

                    <Button HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Click="Button_Click" Tag="{Binding}">
                      <Button.Template>
                        <ControlTemplate>
                          <Grid Background="Transparent" />
                        </ControlTemplate>
                      </Button.Template>
                    </Button>
                  </Grid>

                  <ControlTemplate.Triggers>
                    <EventTrigger RoutedEvent="Mouse.MouseEnter">
                      <EventTrigger.Actions>
                        <BeginStoryboard>
                          <Storyboard>
                            <DoubleAnimation To=".5" Duration="0:0:0.3" Storyboard.TargetName="hover" Storyboard.TargetProperty="Opacity" />
                          </Storyboard>
                        </BeginStoryboard>
                      </EventTrigger.Actions>
                    </EventTrigger>
                    <EventTrigger RoutedEvent="Mouse.MouseLeave">
                      <EventTrigger.Actions>
                        <BeginStoryboard>
                          <Storyboard>
                            <DoubleAnimation To="0" Duration="0:0:0.4" Storyboard.TargetName="hover" Storyboard.TargetProperty="Opacity" />
                          </Storyboard>
                        </BeginStoryboard>
                      </EventTrigger.Actions>
                    </EventTrigger>
                    <Trigger Property="IsSelected" Value="true">
                      <Trigger.EnterActions>
                        <BeginStoryboard>
                          <Storyboard>
                            <DoubleAnimation To="1" Duration="0:0:0.3" Storyboard.TargetName="selected" Storyboard.TargetProperty="Opacity" />
                            <ColorAnimation To="#FFFFFF" Duration="0:0:0.1" Storyboard.TargetName="text" Storyboard.TargetProperty="(TextBlock.Foreground).(SolidColorBrush.Color)" />
                          </Storyboard>
                        </BeginStoryboard>
                      </Trigger.EnterActions>
                      <Trigger.ExitActions>
                        <BeginStoryboard>
                          <Storyboard>
                            <DoubleAnimation To="0" Duration="0:0:0.4" Storyboard.TargetName="selected" Storyboard.TargetProperty="Opacity" />
                            <ColorAnimation To="{x:Null}" Duration="0:0:0.1" Storyboard.TargetName="text" Storyboard.TargetProperty="(TextBlock.Foreground).(SolidColorBrush.Color)" />
                          </Storyboard>
                        </BeginStoryboard>
                      </Trigger.ExitActions>
                    </Trigger>
                  </ControlTemplate.Triggers>
                </ControlTemplate>
              </Setter.Value>
            </Setter>
          </Style>
        </Setter.Value>
      </Setter>
    </Style>
  </UserControl.Resources>

  <Border
      Background="{DynamicResource FilterControlBorderBackgroundBrush}"
      BorderBrush="{DynamicResource FilterControlBorderBrush}"
      BorderThickness="0,0,1,0">
    <DockPanel>
      <Button x:Name="ShowMoreButton" 
              DockPanel.Dock="Bottom" 
              Margin="10" 
              Height="22" 
              HorizontalAlignment="Left" 
              VerticalAlignment="Top" 
              Click="_OnUploadWizardButtonClicked"
              Visibility="{Binding ElementName=TopControl, Path=IsAlbumMode, Converter={StaticResource BooleanToVisibilityConverter}}"
              Style="{DynamicResource StandardButtonStyle}">
        Add more photos
      </Button>

      <TextBlock DockPanel.Dock="Top" Foreground="{DynamicResource SearchAndFilterHeader}" FontSize="{DynamicResource LargeFontSize1}" FontStyle="Italic" FontFamily="{DynamicResource SansSerifFont}" Text="{Binding ElementName=TopControl, Path=TitleText}" Margin="10,17,0,6" />
      <TextBlock DockPanel.Dock="Top" Foreground="{DynamicResource SearchAndFilterHeader}" FontSize="{DynamicResource LargeFontSize1}" FontWeight="Bold" FontFamily="{DynamicResource SansSerifFont}" Text="Sort by" Margin="10,17,0,0" />
      <TabControl x:Name="SortTabs" Margin="0,6,0,0" Style="{StaticResource SortTabControlStyle}" />
    </DockPanel>
  </Border>
</UserControl>